<template>
  <div class="page has-navbar"
       v-nav="{ title: '购花中心', showBackButton: true, onBackButtonClick: back,showMenuButton: true,onMenuButtonClick: menu }">
    <div class="page-content text-center">
      <p class="time">微信客服（客服时间：9:00 - 21:00）</p>
      <div class="contact">
        <div class="wechat">
          <i class="icon ion-social-twitter"></i>
          <p class="title">微信客服</p>
          <p class="miniFont">点击查看客服微信</p>
        </div>
        <div class="phone">
          <i class="icon ion-social-whatsapp"></i>
          <p class="title">电话客服</p>
          <p class="miniFont">177 0819 8449</p>
        </div>
      </div>
      <MenuBotton></MenuBotton>
    </div>
  </div>
</template>

<script>
  import MenuBotton from '../components/MenuBotton'
    export default {
      name: "FlowerServicer",
      data(){
        return{
        }
      },
      components : {
        MenuBotton
      },
      methods : {

        back(){
          this.$router.go(-1)
        },
        menu(){

        }
      }
    }
</script>

<style scoped lang="less">
.page-content{
  background: #ffffff;
  padding: 0 15px;
  .time{
    text-align: start;
    line-height: 40px;
    color: #999999;
  }
  .contact{
    color: #ffffff;
    display: flex;
    justify-content: space-between;
    div{
      width: 48%;
      padding: 15px 0;
      background: seagreen;
      -webkit-border-radius: 4px;
      -moz-border-radius: 4px;
      border-radius: 4px;
      .title{
        font-size: 18px;
        margin-top: 15px;
      }
      .icon{
        font-size: 60px;
      }
      .miniFont{
        font-size: 14px;
        margin-top: -10px;
      }
    }
    .wechat{
      background: #5eb864;
    }
    .phone{
      background: #ff7a7b;
    }
  }
}
</style>
